{{Template:SZPT-CHINA/head}}
<html>

</head>
<!-- jquery 公共JS 公共CSS -->
<script src="https://2021.igem.org/Team:SZPT-CHINA/JS/jQuery&action=raw&ctype=text/javascript"></script>
<link rel="stylesheet" href="https://2021.igem.org/Team:SZPT-CHINA/CSS/Public?action=raw&amp;ctype=text/css">


<script>
    $(document).ready(function () {
        //加载适配
        // var loadImg = document.getElementById('downContent'); //选取id为test的元素
        // loadImg.style.display = 'none'; // 隐藏选择的元素
        init();
        var loadImg = document.getElementById('loadImg');//选取id为test的元素
        loadImg.style.display = 'block';	// 隐藏选择的元素
    });

    var loadhidekey = 0;

    window.onload = function () {
        console.log("页面加载好了", loadhidekey)
        setTimeout(function () {

            //滑到顶部
            document.body.scrollTop = document.documentElement.scrollTop = 0;
            $("#directory").hide();
            $("#loadingHome").hide();

            document.body.append(document.getElementById('directory'))
            document.body.append(document.getElementById('head'))
            // $("#loading").hide();
        }, 10);
        init();
    }
</script>

<script>

    $(document).ready(function () {
        //设置默认


        var pNo = "height: 450px;width:450px;float: left;transition: all 0.3s;"
        var bgNo = "background-color: #f8c8b2;float: left;width: 25%;height: 480px;transition: all 0.3s;"
        var p = "height: 480px;width:480px;float: left;	transition: all 0.3s;"
        var bg = "background-color: #e2594f;float: left;width: 25%;height: 480px;transition: all 0.3s;"

        $("#p1").attr("style", p);
        $("#bg1").attr("style", bg);

        $("#p2").attr("style", pNo);
        $("#bg2").attr("style", bgNo);

        $("#p3").attr("style", pNo);
        $("#bg3").attr("style", bgNo);

        $("#p4").attr("style", pNo);
        $("#bg4").attr("style", bgNo);

        $("#m1").mouseover(
            function () {
                $("#p2").attr("style", pNo);
                $("#bg2").attr("style", bgNo);

                $("#p3").attr("style", pNo);
                $("#bg3").attr("style", bgNo);

                $("#p4").attr("style", pNo);
                $("#bg4").attr("style", bgNo);
                //1
                $("#p1").attr("style", p);
                $("#bg1").attr("style", bg);
            },

        ),
            $("#m2").mouseover(
                function () {
                    $("#p1").attr("style", pNo);
                    $("#bg1").attr("style", bgNo);

                    $("#p3").attr("style", pNo);
                    $("#bg3").attr("style", bgNo);

                    $("#p4").attr("style", pNo);
                    $("#bg4").attr("style", bgNo);
                    //2
                    $("#p2").attr("style", p);
                    $("#bg2").attr("style", bg);
                },
            ),
            $("#m3").mouseover(
                function () {
                    $("#p1").attr("style", pNo);
                    $("#bg1").attr("style", bgNo);

                    $("#p2").attr("style", pNo);
                    $("#bg2").attr("style", bgNo);

                    $("#p4").attr("style", pNo);
                    $("#bg4").attr("style", bgNo);
                    //3
                    $("#p3").attr("style", p);
                    $("#bg3").attr("style", bg);
                },
            ),
            $("#m4").mouseover(
                function () {
                    $("#p1").attr("style", pNo);
                    $("#bg1").attr("style", bgNo);

                    $("#p2").attr("style", pNo);
                    $("#bg2").attr("style", bgNo);

                    $("#p3").attr("style", pNo);
                    $("#bg3").attr("style", bgNo);
                    //4
                    $("#p4").attr("style", p);
                    $("#bg4").attr("style", bg);
                },
            )
        $("#m1").click(function () {
            window.location.href = "https://2021.igem.org/Team:SZPT-CHINA/Team";
        });
        $("#m2").click(function () {
            window.location.href = "https://2021.igem.org/Team:SZPT-CHINA/Attributions";
        });
        $("#m3").click(function () {
            window.location.href = "https://2021.igem.org/Team:SZPT-CHINA/Collaborations";
        });
        $("#m4").click(function () {
            window.location.href = "https://2021.igem.org/Team:SZPT-CHINA/Partnership";
        });

        $("#img1").hover(function () {
            console.log("123")
            $("#img1").attr("src", "https://2021.igem.org/wiki/images/8/86/T--SZPT-CHINA--team-members-lwt_y.png");
        }, function () {
            console.log("3")
            $("#img1").attr("src", "https://2021.igem.org/wiki/images/7/7c/T--SZPT-CHINA--team-members-lwt.png");

        });
        $("#img2").hover(function () {
            console.log("123")
            $("#img2").attr("src", "https://2021.igem.org/wiki/images/d/d9/T--SZPT-CHINA--team-members-zc_y.png");
        }, function () {
            console.log("3")
            $("#img2").attr("src", "https://2021.igem.org/wiki/images/0/0a/T--SZPT-CHINA--team-members-zc.png");


        });
        $("#img3").hover(function () {
            console.log("123")
            $("#img3").attr("src", "https://2021.igem.org/wiki/images/3/34/T--SZPT-CHINA--team-members-zm_y.png");
        }, function () {
            console.log("3")
            $("#img3").attr("src", "https://2021.igem.org/wiki/images/d/db/T--SZPT-CHINA--team-members-zm.png");

        });

        $("#img4").hover(function () {
            console.log("123")
            $("#img4").attr("src", "https://2021.igem.org/wiki/images/a/ad/T--SZPT-CHINA--team-members-zhw_y.png");
        }, function () {
            console.log("3")
            $("#img4").attr("src", "https://2021.igem.org/wiki/images/6/6c/T--SZPT-CHINA--team-members-zhw.png");

        });


        $("#img5").hover(function () {
            console.log("123")
            $("#img5").attr("src", "https://2021.igem.org/wiki/images/f/f3/T--SZPT-CHINA--team-members-hgy_y.png");
        }, function () {
            console.log("3")
            $("#img5").attr("src", "https://2021.igem.org/wiki/images/b/b5/T--SZPT-CHINA--team-members-hgy.png");

        });


        $("#img6").hover(function () {
            console.log("123")
            $("#img6").attr("src", "https://2021.igem.org/wiki/images/b/be/T--SZPT-CHINA--team-members-zjm_y.png");
        }, function () {
            console.log("3")
            $("#img6").attr("src", "https://2021.igem.org/wiki/images/8/82/T--SZPT-CHINA--team-members-zjm.png");

        });

        $("#img7").hover(function () {
            console.log("123")
            $("#img7").attr("src", "https://2021.igem.org/wiki/images/d/d2/T--SZPT-CHINA--team-members-lyn_y.png");
        }, function () {
            console.log("3")
            $("#img7").attr("src", "https://2021.igem.org/wiki/images/e/e1/T--SZPT-CHINA--team-members-lyn.png");

        });


        $("#img8").hover(function () {
            console.log("123")
            $("#img8").attr("src", "https://2021.igem.org/wiki/images/a/ad/T--SZPT-CHINA--team-members-hlq_y.png");
        }, function () {
            console.log("3")
            $("#img8").attr("src", "https://2021.igem.org/wiki/images/a/a6/T--SZPT-CHINA--team-members-hlq.png");

        });

        $("#img9").hover(function () {
            console.log("123")
            $("#img9").attr("src", "https://2021.igem.org/wiki/images/9/91/T--SZPT-CHINA--team-members-zyt_y.png");
        }, function () {
            console.log("3")
            $("#img9").attr("src", "https://2021.igem.org/wiki/images/1/10/T--SZPT-CHINA--team-members-zyt.png");

        });

        $("#img10").hover(function () {
            console.log("123")
            $("#img10").attr("src", "https://2021.igem.org/wiki/images/6/6d/T--SZPT-CHINA--team-members-cxx_y.png");
        }, function () {
            console.log("3")
            $("#img10").attr("src", "https://2021.igem.org/wiki/images/7/74/T--SZPT-CHINA--team-members-cpx.png");

        });

        $("#img11").hover(function () {
            console.log("123")
            $("#img11").attr("src", "https://2021.igem.org/wiki/images/c/c9/T--SZPT-CHINA--team-members-lbm_y.png");
        }, function () {
            console.log("3")
            $("#img11").attr("src", "https://2021.igem.org/wiki/images/8/84/T--SZPT-CHINA--team-members-lbm.png");

        });


        $("#img12").hover(function () {
            console.log("123")
            $("#img12").attr("src", "https://2021.igem.org/wiki/images/8/88/T--SZPT-CHINA--team-members-mzb_y.png");
        }, function () {
            console.log("3")
            $("#img12").attr("src", "https://2021.igem.org/wiki/images/2/22/T--SZPT-CHINA--team-members-mzb.png");

        });


        $("#img13").hover(function () {
            console.log("123")
            $("#img13").attr("src", "https://2021.igem.org/wiki/images/4/45/T--SZPT-CHINA--team-members-zff_y.png");
        }, function () {
            console.log("3")
            $("#img13").attr("src", "https://2021.igem.org/wiki/images/a/a0/T--SZPT-CHINA--team-members-zff.png");

        });


        $("#img14").hover(function () {
            console.log("123")
            $("#img14").attr("src", "https://2021.igem.org/wiki/images/e/ed/T--SZPT-CHINA--team-members-cyt_y.png");
        }, function () {
            console.log("3")
            $("#img14").attr("src", "https://2021.igem.org/wiki/images/5/56/T--SZPT-CHINA--team-members-cyt.png");

        });
    });
</script>
<style>
    .name {
        font-size: 200%;
        font-family: 'Quicksand', sans-serif;
        margin-top: 50px;
        padding: 10px;
        font-weight: 500;
    }

    .personImg {
        width: 295px;
        border-radius: 5px;
    }
</style>

<body class="pc" id="main">

    <!-- loading -->
    <div id="loadingHome"
        style=" position: fixed; left: 0px;top: -100px; width: 100%;height: 115%;z-index: 999999999999;background-color: #f8c8b2;">
        <img id="loadImg"
            style=" position: relative; height: 5%;width: auto;left: 0%;margin:0px auto;top: 300px; text-align: center;display: none;"
            src="https://2021.igem.org/wiki/images/6/6f/T--SZPT-CHINA--iconGIF.png"></img>
    </div>

    <div>
        <div id="downContent">
            <div class="mainImg">
                <div>
                    <div id="bg1" style="background-color: #f8c8b2;float: left;width: 25%;">
                        <image id="p1" src="https://2021.igem.org/wiki/images/f/f5/T--SZPT-CHINA--team-members2.0.png"
                            class="smallImg"></image>
                    </div>
                    <div id="bg2" style="background-color: #f8c8b2;float: left;width: 25%;">

                        <image id="p2"
                            src="https://2021.igem.org/wiki/images/b/b2/T--SZPT-CHINA--team-attributions2.0.png"
                            class="smallImg"></image>

                    </div>
                    <div id="bg3" style="background-color: #f8c8b2;float: left;width: 25%;">
                        <image id="p3"
                            src="https://2021.igem.org/wiki/images/b/bf/T--SZPT-CHINA--team-collaborations2.0.png"
                            class="smallImg"></image>
                    </div>
                    <div id="bg4" style="background-color: #f8c8b2;float: left;width: 25%;">
                        <image id="p4"
                            src="https://2021.igem.org/wiki/images/5/5a/T--SZPT-CHINA--team-partnership2.0.png"
                            class="smallImg"></image>
                    </div>
                </div>
                <div style="z-index: 99;position: absolute;">
                    <image src="https://2021.igem.org/wiki/images/8/8c/T--SZPT-CHINA--team-members.png"
                        style="margin-top: -50px;margin-left: 550px;"> </image>
                </div>
                <div style="margin-top: 50px;">
                    <div id="m1" style="width: 480px;height: 480px;z-index: 9999;position: absolute;float:left;"></div>
                    <div id="m2"
                        style="width: 480px;height: 480px;z-index: 9999;position: absolute;float:left;margin-left: 480px;">
                    </div>
                    <div id="m3"
                        style="width: 480px;height: 480px;z-index: 9999;position: absolute;float:left;margin-left: 960px;">
                    </div>
                    <div id="m4"
                        style="width: 480px;height: 480px;z-index: 9999;position: absolute;float:left;margin-left: 1440px;">
                    </div>
                </div>
            </div>
            <!-- down -->
            <div style="width: 1920px;">
                <div id="blue"style="float:left; height: 8000px; width: 55px;background-color: #2588d4;">
                </div>

                <div class="content" style="float:left;width: 1810px;">
                    <video src="https://2021.igem.org/wiki/images/b/b5/T--SZPT-CHINA--team-members-video.mp4" controls
                        style="margin-top: 250px;margin-left: 424px;width: 1000px;"> </video>
                    <p style="text-align: center;margin-top: 150px;font-size:360%">Team Leaders</p>

                    <div style="display: flex;margin-top: 170px;">
                        <view>
                            <view>
                                <image class="personImg" id="img1"
                                    src="https://2021.igem.org/wiki/images/7/7c/T--SZPT-CHINA--team-members-lwt.png"
                                    style="margin-left: 190px;"></image>
                            </view>
                            <view style="text-align: center;">
                                <h6 class="name" style="margin-left: 213px;">Wanting Liu </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img2"
                                    src="https://2021.igem.org/wiki/images/0/0a/T--SZPT-CHINA--team-members-zc.png"
                                    style="margin-left: 263px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 349px;">Chun Zheng </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img3"
                                    src="https://2021.igem.org/wiki/images/d/db/T--SZPT-CHINA--team-members-zm.png"
                                    style="margin-left: 271px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 360px;">Min Zhang </h6>
                            </view>
                        </view>
                    </div>

                    <p style="text-align: center;margin-top: 150px;font-size:360%">Members</p>

                    <div style="display: flex;margin-top: 170px;">
                        <view>
                            <view>
                                <image class="personImg" id="img4"
                                    src="https://2021.igem.org/wiki/images/6/6c/T--SZPT-CHINA--team-members-zhw.png"
                                    style="margin-left: 190px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 266px;">Hongwei Zhu</h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img5"
                                    src="https://2021.igem.org/wiki/images/b/b5/T--SZPT-CHINA--team-members-hgy.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 160px;">Guiyi Huang </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img6"
                                    src="https://2021.igem.org/wiki/images/8/82/T--SZPT-CHINA--team-members-zjm.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 154px;">Jiamei Zhao </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img7"
                                    src="https://2021.igem.org/wiki/images/e/e1/T--SZPT-CHINA--team-members-lyn.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 153px;">Yingnan Liang </h6>
                            </view>
                        </view>



                    </div>
                    <div style="display: flex;margin-top: 170px;">
                        <view>
                            <view>
                                <image class="personImg" id="img8"
                                    src="https://2021.igem.org/wiki/images/a/a6/T--SZPT-CHINA--team-members-hlq.png"
                                    style="margin-left: 190px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 255px;">Liqun Huang </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img9"
                                    src="https://2021.igem.org/wiki/images/1/10/T--SZPT-CHINA--team-members-zyt.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 153px;">Yuntao Zheng </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img10"
                                    src="https://2021.igem.org/wiki/images/7/74/T--SZPT-CHINA--team-members-cpx.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 153px;">Peixin Chen </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img11"
                                    src="https://2021.igem.org/wiki/images/8/84/T--SZPT-CHINA--team-members-lbm.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 153px;">BingMin Lin </h6>
                            </view>
                        </view>


                    </div>
                    <div style="display: flex;margin-top: 170px;">
                        <view>
                            <view>
                                <image class="personImg" id="img12"
                                    src="https://2021.igem.org/wiki/images/2/22/T--SZPT-CHINA--team-members-mzb.png"
                                    style="margin-left: 190px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 255px;">Zhibing Mai </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img13"
                                    src="https://2021.igem.org/wiki/images/a/a0/T--SZPT-CHINA--team-members-zff.png"
                                    style="margin-left: 80px;"></image>
                            </view>

                            <view>

                                <h6 class="name" style="margin-left: 168px;">Feifei Zhu</h6>

                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img14"
                                    src="https://2021.igem.org/wiki/images/5/56/T--SZPT-CHINA--team-members-cyt.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 153px;">Yuetong Chen </h6>
                            </view>
                        </view>



                    </div>

                    <p style="text-align: center;margin-top: 150px;font-size:360%">PIs</p>

                    <div style="display: flex;margin-top: 170px;">

                        <view>
                            <view>
                                <image class="personImg" id="img15"
                                    src="https://2021.igem.org/wiki/images/c/c6/T--SZPT-CHINA--team-members-kjj.png"
                                    style="margin-left: 300px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 372px;">Jingjing Wei</h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img16"
                                    src="https://2021.igem.org/wiki/images/f/ff/T--SZPT-CHINA--team-members-lhb.png"
                                    style="margin-left: 600px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 691px;">Hongbo Liu</h6>
                            </view>
                        </view>




                    </div>
                    <p style="text-align: center;margin-top: 150px;font-size:360%">Instructors</p>

                    <div style="display: flex;margin-top: 170px;">

                        <view>
                            <view>
                                <image class="personImg" id="img17"
                                    src="https://2021.igem.org/wiki/images/9/94/T--SZPT-CHINA--team-members-gb.png"
                                    style="margin-left: 300px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 375px;">YanMei Gao </h6>
                            </view>
                        </view>


                        <view>
                            <view>
                                <image class="personImg" id="img18"
                                    src="https://2021.igem.org/wiki/images/1/19/T--SZPT-CHINA--team-members-xxc.png"
                                    style="margin-left: 600px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 672px;">Xiaochen Xing </h6>
                            </view>
                        </view>




                    </div>

                    <p style="text-align: center;margin-top: 150px;font-size:360%">Advisors</p>

                    <div style="display: flex;margin-top: 170px;">
                        <view>
                            <view>
                                <image class="personImg" id="img19"
                                    src="https://2021.igem.org/wiki/images/b/bb/T--SZPT-CHINA--team-members-llx.png"
                                    style="margin-left: 190px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 284px;">Lixing Li </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img20"
                                    src="https://2021.igem.org/wiki/images/c/c8/T--SZPT-CHINA--team-members-lst.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 164px;">Shuting Li </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img21"
                                    src="https://2021.igem.org/wiki/images/2/25/T--SZPT-CHINA--team-members-lht.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 153px;">Yetong Liang </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img22"
                                    src="https://2021.igem.org/wiki/images/0/05/T--SZPT-CHINA--team-members-lrx.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 166px;">Ruixin Lin </h6>
                            </view>
                        </view>




                    </div>
                    <div style="display: flex;margin-top: 170px;">
                        <view>

                            <image class="personImg" id="img23"
                                src="https://2021.igem.org/wiki/images/2/22/T--SZPT-CHINA--team-members-yd.png"
                                style="margin-left: 190px;"></image>
                            <h6 class="name" style="margin-left: 263px;">Dong Yang</h6>

                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img24"
                                    src="https://2021.igem.org/wiki/images/4/4b/T--SZPT-CHINA--team-members-yxq.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 162px;">Xiaoqi Ye </h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img25"
                                    src="https://2021.igem.org/wiki/images/8/8a/T--SZPT-CHINA--team-members-zjh.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 153px;">Jianhua Zhou</h6>
                            </view>
                        </view>
                        <view>
                            <view>
                                <image class="personImg" id="img26"
                                    src="https://2021.igem.org/wiki/images/5/5b/T--SZPT-CHINA--team-members-zlz.png"
                                    style="margin-left: 80px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 165px;">Lizhen Zhu </h6>
                            </view>
                        </view>




                    </div>
                    <div style="display: flex;margin-top: 170px;">
                        <view>
                            <view>
                                <image class="personImg" id="img27"
                                    src="https://2021.igem.org/wiki/images/6/6e/T--SZPT-CHINA--team-members-hjw.png"
                                    style="margin-left: 757px;"></image>
                            </view>
                            <view>
                                <h6 class="name" style="margin-left: 830px;">Jiawei Huang</h6>
                            </view>
                        </view>


                    </div>

                </div>
                <div id="red"style="float: left;height: 8000px;width: 55px;background-color: #d44225;">
                </div>

            </div>
        </div>
        <image src="https://2021.igem.org/wiki/images/8/8d/T--SZPT-CHINA--bottomPic.png" class="pic"
        style="margin-top: -372px;width: 1920px;"></image>
    </div>
</body>

<script>
    var bodyStyle = document.createElement('style')
    var docWidth, docHeight;
    var designWidth, designHeight;

    // 屏幕缩放实现
    function refreshScale() {
        bodyStyle.innerHTML = `body{width:${designWidth}px; height:${designHeight}px!important;}`
        document.documentElement.firstElementChild.appendChild(bodyStyle)
        document.getElementById('main').style = 'display:flex'
        //document.getElementsByClassName('mobile')[0].style = 'display:none'

        var widthRatio = docWidth / designWidth,
            heightRatio = docHeight / designHeight;
        var topRatio = 26 * heightRatio;
        //heightRatio=0.782222;
        //解决因transform导致margin-top
        document.getElementById('content').style = `transform:scale(${widthRatio},${heightRatio});transform-origin:left top;margin-top: -${topRatio}px;`;
        // 应对浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况
        setTimeout(function () {
            var lateWidth = document.documentElement.clientWidth,
                lateHeight = document.documentElement.clientHeight;
            if (lateWidth === docWidth) return;

            widthRatio = lateWidth / designWidth
            heightRatio = lateHeight / designHeight
            document.getElementById('content').style = "transform:scale(" + widthRatio + "," + heightRatio + ");transform-origin:left top;margin-top: -${topRatio}px;"
        }, 0)
    }

    // 清除scale
    function clearScale() {
        // 清除pc样式
        bodyStyle.innerHTML = ``
        document.documentElement.firstElementChild.appendChild(bodyStyle)
        document.body.style = "transform:none;transform-origin:none"
    }

    // 初始化
    function init() {
        // 获取当前屏幕可视区域大小
        docWidth = document.documentElement.clientWidth;
        docHeight = document.documentElement.clientHeight;
        // 判断是否是移动设备
        if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|Windows Phone/i.test(navigator.userAgent)) {

            // mobilePage();
            let mainClass = document.getElementById('main').classList;
            designWidth = 1920;
            designHeight = 3100;
            mainClass.add('pc');
            mainClass.remove('large');

            //document.getElementById('mainImg').style = "margin-top:45px";
            
            var value = document.getElementById('blue').getAttribute("style")
            value = value.replace(/4500/, "7200")
            $("#blue").attr("style", value);

            var value = document.getElementById('red').getAttribute("style")
            value = value.replace(/4500/, "7200")
            $("#red").attr("style", value);
            
            refreshScale()
        } else {
            //pc
            let mainClass = document.getElementById('main').classList;
            designWidth = 1920;
            designHeight = 930;
            mainClass.add('pc');
            mainClass.remove('large');
            refreshScale()

        }
    }

    // 大屏设置 rem 函数
    function setRem(designSize) {
        // 基准大小
        baseSize = 100;
        let basePc = baseSize / designSize; // 表示1680的设计图,使用100PX的默认值
        let vW = window.innerWidth; // 当前窗口的宽度

        let rem = vW * basePc; // 以默认比例值乘以当前窗口宽度,得到该宽度下的相应font-size值
        document.documentElement.style.fontSize = rem + "px";
    }



    // 移动端页面
    function mobilePage() {
        clearScale()
        // 是移动设备 展示移动设备页
        //document.getElementById('main').style = 'display:none'
        //document.getElementsByClassName('mobile')[0].style = 'display:flex'
        // mobile 设置 rem 函数
        let designSize = 750;
        setRem(designSize);


    }

    // 初始化
    //init();

    // 监听前进/后退以及load事件触发
    window.addEventListener("pageshow", function (e) {
        if (e.persisted) { // 浏览器后退的时候重新计算
            init()
        }
    }, false);

    // 监听屏幕缩放
    window.addEventListener("resize", function () {
        init()
    }, false);
</script>
<!-- END-适配 -->





</html>